<template xmlns:v-on="http://www.w3.org/1999/xhtml">
    <div id="app" class="login">
        <div class="loginope" v-loading.body="loading" element-loading-text="登录中....">
            <h3>服 务 后 台</h3>
            <div class="loginIng">
                <div>用户名：</div>
                <div><input type="text" v-model="user.name"></div>
            </div>
            <div class="loginIng">
                <div>密&nbsp;&nbsp;&nbsp;&nbsp;码：</div>
                <div><input type="password" v-model="user.password"></div>
            </div>
            <div class="loginBut">
                <div>
                    <template>
                        <el-checkbox class="memory" v-model="checked">记住密码</el-checkbox>
                    </template>
                </div>
                <div>
                    <div class="but" @click="loginClick">登陆</div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    import { mapActions } from 'vuex'
    export default {
        name: 'login',
        data() {
            return {
                checked: false,
                user: {
                    name: '',
                    password: ''
                },
                loading: false
            }
        },
        created: function () {
            var self = this
            sessionStorage.removeItem('userId')
            sessionStorage.removeItem('userName')
            var name = localStorage.getItem('name')
            var psw = localStorage.getItem('psd')
            var checkStr = localStorage.getItem('check');
            if (checkStr == 'true') {
                self.checked = true
            } else {
                self.checked = false
            }
            self.user.name = name
            self.user.password = psw
            document.querySelector('body').addEventListener('keypress', function (e) {
                if (e.keyCode === 13) {
                    self.loginClick();
                }
            })
        },
        methods: {
            loginClick() {
                var memoryStr = this.checked
                if (memoryStr == true) {
                    localStorage.setItem('name', this.user.name)
                    localStorage.setItem('psd', this.user.password)
                    localStorage.setItem('check', this.checked);
                } else {
                    localStorage.removeItem('name', this.user.name)
                    localStorage.removeItem('psd', this.user.password)
                    localStorage.removeItem('check', this.checked);
                }
                this.$router.push({
                    path: '/home'
                })
            }
        }
    }
</script>
<style scoped src="../assets/css/login.css">

</style>